<template>
  <div>
    <div>
      <!-- 顶部导航 -->
      <van-nav-bar title="冬奥新闻 " left-arrow @click-left="$router.go(-1)" />
      <!-- 文章标题 -->
      <div class="newsTitle">
        {{ newsdetail.title }}
      </div>
      <div>
        <img :src="/pic&video/+newsdetail.pic" alt="" />
      </div>
      <!-- 文章正文 -->
      <div v-html="newsdetail.content" class="newsDetail"></div>
      <div class="newsDate">
        <span> {{ newsdetail.source }}</span>
        <span> {{ newsdetail.date }}</span>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      newsdetail: [],
    }
  },
  mounted() {
    // 获取指定文章信息
    let id = this.$route.query.id
    this.axios.get(`newsdetail?id=${id}`).then((res) => {
      this.newsdetail = res.data.result
      console.log(this.newsdetail)
    })
  },
}
</script>
<style lang="less" scoped>
  img{
    width: 100%;
  }
.newsTitle {
  font-size: 20px;
  font-weight: 700;
  padding: 15px 0 5px;
  margin: 0 15px;
  line-height: 1.5em;

}
.newsDetail {
  font-size: 16px;
  margin: 0 15px;
  text-indent: 1rem;
  line-height: 2em;
}
.newsDate {
  color: #888;
  line-height: 28px;
  font-size: 13px;
  margin: 0 10px;
  text-align: right;
}
</style>
